import * as echarts from 'echarts/core';
import {
  TooltipComponent,
  GridComponent,
  LegendComponent,
  MarkLineComponent,
} from 'echarts/components';
import { PieChart } from 'echarts/charts';
import { CanvasRenderer } from 'echarts/renderers';
import styleUtil from '@/utils/styleUtil.js';

echarts.use([
  TooltipComponent,
  GridComponent,
  LegendComponent,
  MarkLineComponent,
  PieChart,
  CanvasRenderer,
]);

export default {
  tooltip: {
    show: true,
    textStyle: {
      fontSize: styleUtil.px2vh(14),
      color: '#fff',
    },
    backgroundColor: 'rgba(51, 51, 51, 0.7)',
    borderColor: 'rgba(51, 51, 51, 0.7)',
    borderWidth: 0,
  },

  // 设置字体的样式
  textStyle: {
    fontSize: 15,
    fontWeight: 'bolder',
  },

  legend: {
    data: ['糖尿病', '甲状腺', '肥胖症', '骨质疏松症'],

    // 设置item按钮的整体宽度大小
    width: '100%',
    top: '80px',
    // 设置item按钮的水平和重置安放位置
    // x:'left',
    // y:'center',

    // 设置Item按钮的宽
    // itemHeight设置高
    itemWidth: 20,
    show: false,

    textStyle: {
      color: 'white',
    },

    // 设置item按钮的间隔
    itemGap: 30,

    // 设置item按钮的背景颜色
    // backgroundColor:"#00e",

    //   按钮样式为圆形
    icon: 'circle',
  },

  // 可视化的工具箱
  toolbox: {
    show: true,
  },

  color: ['#134ad5', '#b85f9c', '#4c9817', '#cc793e', '#b7bb29', '#32b7d7'],
  // color: ['#0ff', '#000', '#016dff', '#cdfffe', '#67ffff'],

  series: [
    {
      name: '',
      top: '10px',
      bottom: '10px',
      // 内圆和外园的比例
      radius: ['0', '100%'],
      itemStyle: {
        // emphasis：设置鼠标放到哪一块扇形上面的时候，扇形样式、阴影
        emphasis: {
          shadowBlur: 100,
          shadowOffsetX: 20,
          shadowColor: 'black',
        },
        borderWidth: 1,
        borderColor: '#fff',
      },

      // 设置value比例

      type: 'pie',

      data: [
        // {
        //   name: '甲状腺',
        //   value: 5000,
        //   label: {
        //     normal: {
        //       show: false,
        //       //    position:'inner'在图表内部显示
        //       position: 'inner',
        //       formatter: ' b:{d}%', //自定义显示格式(b:name, c:value, d:百分比)
        //     },
        //   },
        // },
        // {
        //   name: '肥胖症',
        //   value: 6600,
        //   label: {
        //     normal: {
        //       show: false,
        //       //    position:'inner'在图表内部显示
        //       position: 'inner',
        //       formatter: 'b: {d}%', //自定义显示格式(b:name, c:value, d:百分比)
        //     },
        //   },
        // },
        // {
        //   name: '骨质疏松症',
        //   value: 3000,
        //   label: {
        //     normal: {
        //       show: false,
        //       //    position:'inner'在图表内部显示
        //       position: 'inner',
        //       formatter: 'b: {d}%', //自定义显示格式(b:name, c:value, d:百分比)
        //     },
        //   },
        // },
        // {
        //   name: '糖尿病',
        //   value: 7800,
        //   label: {
        //     normal: {
        //       show: false,
        //       //    position:'inner'在图表内部显示
        //       position: 'inner',
        //       formatter: 'b: {d}%', //自定义显示格式(b:name, c:value, d:百分比)
        //     },
        //   },
        // },
      ],
    },
  ],
};
